<template>
  <div>
    <el-row :gutter="20">
      <el-col :md="10">
        <el-date-picker
          v-model="date"
          type="datetimerange"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
        ></el-date-picker>
      </el-col>
      <el-col :md="4">
        <el-button type="primary" @click="query">查询</el-button>
      </el-col>
    </el-row>
    <el-row>
      <com-echarts
        :sendStyle="{ w: '100%', h: '500px', bgc: 'white' }"
        :sendObj="obj"
      ></com-echarts>
    </el-row>
  </div>
</template>

<script>
import ComEcharts from "../../components/comecharts";
import { api_census_order } from "../../api/order.js";
import moment from "moment";
export default {
  components: {
    ComEcharts,
  },
  data() {
    return {
      date: [],
      obj: {
        title: "订单统计",
        legend: ["订单"],
        xAxis: [],
        series: [],
      },
    };
  },
  mounted() {
    this.query();
  },
  methods: {
    async query() {
      let rst = await api_census_order({ date: JSON.stringify(this.date) });
      let { data } = rst;
      this.obj.xAxis = data.map((item, index) => {
        return moment(item.orderTime).format("MM-DD ");
      });
      this.obj.series = [
        {
          name: "订单",
          type: "line",
          stack: "Total",
          data:data.map((item,index)=>{
            return item.orderAmount
          }),
        },
      ];
      console.log(rst);
    },
  },
};
</script>

<style lang="less" scoped>
</style>